<template>
  <div class="boxs" style="width: 98%">
    <!-- 顶部 -->
    <div class="box-top">
      <li>查询条件</li>
    </div>
    <!-- 中间 -->
    <div class="box-middle">
      <el-form ref="form" size="mini" :inline="true"   :model="form">
        <el-form-item label="订单号">
          <el-input v-model="form.orderId" @keyup.enter.native="accountLogin('orderId')"></el-input>
        </el-form-item>
        <el-form-item label="三方接口订单号">
          <el-input v-model="form.tripartiteOrderId" @keyup.enter.native="accountLogin('tripartiteOrderId')"></el-input>
        </el-form-item>
        <!-- <el-form-item label="乘机人">
          <el-input v-model="form.gustName" ref="orderId" @keyup.enter.native="accountLogin('gustName')"></el-input>
        </el-form-item> -->
        <el-form-item label="手机号">
          <el-input v-model="form.gustPhone" ref="gustName" @keyup.enter.native="accountLogin('gustPhone')"></el-input>
        </el-form-item>
        <el-form-item label="pnr/记录编码">
          <el-input v-model="form.pnr" ref="gustPhone"></el-input>
        </el-form-item>
        <el-form-item label="订单来源">
          <el-select v-model="form.orderSource" clearable size="mini">
            <el-option label="全部" value=""></el-option>
            <el-option label="CRM" value="crm"></el-option>
            <el-option label="小程序" value="program"></el-option>
          </el-select>
        </el-form-item>
        <!-- 起飞时间 -->
        <el-form-item label="预定时间">
          <el-date-picker size="mini" style="width: 140px" v-model="CX.date1" type="date" placeholder="选择日期"
            :value-format="format">
          </el-date-picker>
          <span class="invoice-9">至 </span>
          <el-date-picker size="mini" style="width: 140px" v-model="CX.date2" type="date" placeholder="选择日期"
            :value-format="format">
          </el-date-picker>
        </el-form-item>
          <el-form-item label="会员卡号">
          <el-input v-model="form.cardNumber" ></el-input>
        </el-form-item>
         <el-form-item label="会员姓名">
          <el-input v-model="form.customerName" ref="gustPhone"></el-input>
        </el-form-item>
          <el-form-item label="操作员">
          <el-input v-model="form.employeeName" ></el-input>
        </el-form-item>
        <el-form-item label="航班">
          <el-input v-model="form.flightNo" placeholder="例:CA1501" ></el-input>
        </el-form-item>
        <el-form-item label="航段信息">
          <el-input v-model="form.flightSegment" placeholder="例:PKXSHA" ></el-input>
        </el-form-item>
         <el-form-item label="乘机人姓名">
          <el-input v-model="form.gustName"  ></el-input>
        </el-form-item>
        <el-form-item label="乘机人证件号">
          <el-input v-model="form.cardNo"  ></el-input>
        </el-form-item>
        <el-form-item label="票号">
          <el-input v-model="form.ticketNo" ref="gustPhone"></el-input>
        </el-form-item> 
        <el-form-item label="支付状态">
          <el-select v-model="form.payStatus" placeholder="">
            <el-option label="全部" value=""></el-option>
            <el-option label="未支付" value="unpaid"></el-option>
            <el-option label="已支付" value="haspay"></el-option>
            <el-option label="支付失败" value="payFail"></el-option>
            <el-option label="取消支付" value="cancelpay"></el-option>
          </el-select>
        </el-form-item> 
        <el-form-item label="客票状态">
            <el-select v-model="form.orderStatus" placeholder="">
            <el-option label="全部" value=""></el-option>
            <el-option label="退票" value="refund"></el-option>
            <el-option label="改期" value="change"></el-option>
            <el-option label="留用" value="reserve"></el-option>
          </el-select>
        </el-form-item> 
        <el-form-item label="订单状态">
          <el-select v-model="form.status" placeholder="">
            <el-option v-for="item in flightStatusOptionList" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item> 
        <el-form-item label="接口渠道">
          <el-select v-model="form.ticketWay" placeholder="">
            <el-option label="全部" value=""></el-option>
            <el-option label="春秋" value="Spring"></el-option>
            <el-option label="IBE 领达" value="LinkStar"></el-option>
            <el-option label="去哪儿" value="Qunar"></el-option>
            <el-option label="瑞丽" value="DR"></el-option>
            <el-option label="华夏" value="G5"></el-option>
            <!-- <el-option label="航班管家" value="HangBanGuanJia"></el-option> -->
          </el-select>
        </el-form-item> 
        <el-form-item>
          <el-button @click="search" type="warning">查询</el-button>
          <el-button @click="FreeInsurance" type="primary" size="small">新建订单</el-button>
        </el-form-item>
      </el-form>
    </div>
    <!-- 底部 -->
    <div class="box-button">订单列表</div>

    <!-- 底部表格 -->
    <div class="box-button-form">
      <el-table :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }" :data="ordersList" border size="mini" style="padding: 0 20px 0 20px">
        <el-table-column prop="orderId" label="订单号" width="95">
        </el-table-column>
        <el-table-column prop="ticketWay" label="接口渠道" width="72">
        </el-table-column>
        <el-table-column prop="guestNumber" label="票量" width="50">
        </el-table-column>
        <el-table-column label="乘机人" width="110">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.orderItemS" :key="index">
              {{ item.passengerName }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="票号" width="75">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.orderItemS" :key="index">
              {{ item.ticketNo?item.ticketNo:'暂无' }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="pnr" label="记录编码" width="72">
        </el-table-column>
        <el-table-column label="PNR状态" width="72">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.orderItemS" :key="index">
              {{ item.actionCode }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="航程" width="100">
          <template slot-scope="scope">
              {{scope.row.voyage}}({{scope.row.tripType == 'RT'?'往返':scope.row.tripType == 'OT'?'中转':'单程'}})
          </template>
        </el-table-column>
        <el-table-column label="航班号" width="80">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.orderItemS" :key="index">
              {{ item.flightNo }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="起飞时间" width="85">
          <template slot-scope="scope">
            <div v-for="(item, index) in scope.row.orderItemS" :key="index">
              {{ item.departureTime }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="createTime" label="预定时间" width="85">
        </el-table-column>
        <el-table-column prop="payStatus" label="支付状态" width="75">
          <template slot-scope="scope">
            {{scope.row.payStatus | payStatus}}
          </template>
        </el-table-column>
        <el-table-column prop="orderStatus" label="订单状态" width="75">
          <template slot-scope="scope">
            {{scope.row.orderStatus | orderStatus}}
          </template>
        </el-table-column>
        <el-table-column label="订单来源">
          <template slot-scope="scope"> 
            {{scope.row.orderSource | orderSource}}
          </template>
        </el-table-column>
        <el-table-column prop="adminName" label="预定员" width="60">
        </el-table-column>
        <el-table-column prop="10" label="操作" fixed="right" width="320">
          <template slot-scope="scope">
            <el-button type="primary" v-show="scope.row.btnGroupStatus.detaileBtn" @click="handleClick(scope.row)" size="mini">详情</el-button>
            <!-- scope.row.orderItemS.guestStatus!=null -->
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.changePayBtn">修改支付方式</el-button>
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.changeTicktetNoBtn" @click="BanksModify(scope.row)">修改票号</el-button>
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.returnBtn" @click="refund(scope.row)">退票</el-button>
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.changeBtn" @click="gaiqi(scope.$index, scope.row)">改期</el-button>
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.goPayBtn" @click="pay(scope.$index, scope.row)">去支付</el-button>
            <el-button type="primary" size="mini" v-show="scope.row.btnGroupStatus.goPayChangeBtn" @click="pay(scope.$index, scope.row,'change')">去支付</el-button>
            <el-popconfirm :title="scope.row.btnGroupStatus.cancelBtn?'确定取消订单吗？':'确定取消改签吗？'" @confirm="confirmClick" v-show="scope.row.btnGroupStatus.cancelBtn || scope.row.btnGroupStatus.cancleChangeBtn">
              <el-button style="margin-left:12px !important" @click="cancelClick(scope.row)" v-if="scope.row.btnGroupStatus.cancelBtn" slot="reference" size="mini" type="primary">取消订单</el-button>
              <el-button style="margin-left:12px !important" @click="cancelClick(scope.row,'change')" v-if="scope.row.btnGroupStatus.cancleChangeBtn" slot="reference" size="mini" type="primary">取消改签</el-button>
            </el-popconfirm>
          </template>
        </el-table-column>
      </el-table>
      <!-- 底部分页 -->
      <div class="block">
        <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
          :page-sizes="[10, 15, 20]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper"
          :total="pageTotal">
        </el-pagination>
      </div>
    </div>
    <!-- 查看订单详情 -->
    <el-dialog title="订单浏览" :visible.sync="cancellog" :close-on-click-modal="false" width="80%">
      <div class="header-1">
        <div class="header-1-1-1">
          <span class="tit_t">保险信息</span>
        </div>
      </div>
      <el-table border :data="lists" size="mini" :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }" style="width: 100%; margin-top: 20px; margin-left: 10px" :tree-props="{ children: 'children' }">
        <el-table-column prop="orderId" label="乘客姓名" width="150">
        </el-table-column>
        <el-table-column prop="name" label="保险金额" width="144">
        </el-table-column>
        <el-table-column prop="name" label="保险公司" width="230">
        </el-table-column>
        <el-table-column prop="name" label="保险种类" width="140">
        </el-table-column>
        <el-table-column prop="name" label="保单号" width="230">
        </el-table-column>
        <el-table-column prop="name" label="出保人" width="150">
        </el-table-column>
        <el-table-column prop="name" label="退保状态" width="140">
        </el-table-column>
        <el-table-column prop="name" label="线下退款" width="140">
        </el-table-column>
      </el-table>
      <div class="header-1">
        <div class="header-1-1-1">
          <span class="tit_t">二次产品</span>
        </div>
      </div>
      <el-table border :data="lists" size="mini" :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }" style="width: 100%" :tree-props="{ children: 'children' }">
        <el-table-column prop="orderId" label="主单主键" width="150">
        </el-table-column>
        <el-table-column prop="name" label="旅客姓名" width="144">
        </el-table-column>
        <el-table-column prop="name" label="证件号" width="230">
        </el-table-column>
        <el-table-column prop="name" label="产品名称" width="140">
        </el-table-column>
        <el-table-column prop="name" label="产品状态" width="230">
        </el-table-column>
        <el-table-column prop="name" label="数量" width="150">
        </el-table-column>
        <el-table-column prop="name" label="销售价" width="140">
        </el-table-column>
        <el-table-column prop="name" label="保单号" width="140">
        </el-table-column>
        <el-table-column prop="name" label="退废状态" width="140">
        </el-table-column>
        <el-table-column prop="name" label="退票费用" width="140">
        </el-table-column>
        <el-table-column prop="name" label="下单时间" width="140">
        </el-table-column>
      </el-table>
      <!-- <div class="header-1">
        <div class="header-1-1-1">
          <span class="tit_t">订单基本信息</span>
        </div>
      </div> -->
      <div class="header-1">
        <div class="header-1-1-1">
          <span class="tit_t">登机牌信息</span>
        </div>
      </div>
    </el-dialog>
    <!-- 修改支付方式 -->
    <el-dialog title="修改支付方式" :visible.sync="trainModifywindow" ref="paywayList" :close-on-click-modal="false"
      width="70%">
      <el-form :model="paywayList" :rules="rules" ref="ruleForm" size="mini">
        <div style="display:flex">
          <el-form-item label="支付总金额" style="display:flex;margin:0 20px 0 0">
            <el-input :disabled="true" style="width:80px" v-model="paywayList.amount"></el-input>
          </el-form-item>
          <el-form-item label="预留款" style="display:flex;margin:0 20px 0 0">
            <el-input :disabled="true" style="width:80px" v-model="paywayList.reserveMoney"></el-input>
          </el-form-item>
          <el-form-item label="使用预留款金额" style="display:flex;margin:0 20px 0 0" prop="applyMoney">
            <el-input style="width:80px" @input="inputaside" v-model="paywayList.applyMoney"></el-input>
          </el-form-item>
          <el-form-item label="剩余预留款金额" style="display:flex">
            <el-input :disabled="true" style="width:80px" v-model="paywayList.asidemoney"></el-input>
          </el-form-item>
        </div>
        <div style="display:flex">
          <el-form-item label="应支付金额" style="display:flex;margin:0 20px 0 0">
            <el-input :disabled="true" style="width:80px" v-model="paywayList.shouldbemoney"></el-input>
          </el-form-item>
        </div>
        <div style="display:flex;margin:20px 0 0 0">
          <el-form-item label="支付方式" style="display:flex;margin:0 20px 0 0" prop="paytype">
            <el-select clearable @change="cityChange" v-model="paywayList.paytype" style="width: 150px"
              placeholder="请选择支付类型" size="mini">
              <el-option v-for="(item,index) in certificate" :key="index" :label="item.label" :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <!-- 储蓄卡 -->
        <div style="margin:20px 0 0 0" v-if="this.type=='debitcard'">
          <div style="display: flex; margin: 0 0 0 0">
            <el-form-item label="银行卡号" style="display:flex;margin:0 20px 0 0" prop="cardNumber">
              <el-input size="mini" v-model="paywayList.cardNumber" style="width: 240px"></el-input>
            </el-form-item>
            <el-form-item label="持卡人" style="display:flex;margin:0 20px 0 0" prop="cardholder">
              <el-input size="mini" v-model="paywayList.cardholder" style="width: 150px"></el-input>
            </el-form-item>
            <el-form-item label="手机号" style="display:flex;margin:0 20px 0 0" prop="contractPhoneOne">
              <el-input size="mini" v-model="paywayList.contractPhoneOne" style="width: 150px"></el-input>
            </el-form-item>
          </div>
          <div style="display: flex; margin: 20px 0 0 0">
            <el-form-item label="证件号" style="display:flex;margin:0 20px 0 0" prop="custCertificateNo">
              <el-input size="mini" v-model="paywayList.custCertificateNo" style="width: 240px"></el-input>
            </el-form-item>
          </div>
        </div>
        <!-- 信用卡 -->
        <div style="margin:20px 0 0 0" v-if="this.type=='creditcard'">
          <div style="display: flex; margin: 0 0 0 0">
            <el-form-item label="银行卡号" style="display:flex;margin:0 20px 0 0" prop="cardNumber">
              <el-input size="mini" v-model="paywayList.cardNumber" style="width: 240px"></el-input>
            </el-form-item>
            <el-form-item label="持卡人" style="display:flex;margin:0 20px 0 0" prop="cardholder">
              <el-input size="mini" v-model="paywayList.cardholder" style="width: 150px"></el-input>
            </el-form-item>
            <el-form-item label="手机号" style="display:flex;margin:0 20px 0 0" prop="contractPhoneOne">
              <el-input size="mini" v-model="paywayList.contractPhoneOne" style="width: 150px"></el-input>
            </el-form-item>
          </div>
          <div style="display: flex; margin: 20px 0 0 0">
            <el-form-item label="证件号" style="display:flex;margin:0 20px 0 0" prop="custCertificateNo">
              <el-input size="mini" v-model="paywayList.custCertificateNo" style="width: 200px"></el-input>
            </el-form-item>
            <el-form-item label="CVV2" style="display:flex;margin:0 20px 0 0" prop="Cvv2">
              <el-input v-model="paywayList.Cvv2" size="mini" style="width: 150px"></el-input>
            </el-form-item>
            <el-form-item label="卡有效期" style="display:flex;margin:0 20px 0 0" prop="creditCardTime">
              <el-date-picker v-model="paywayList.creditCardTime" type="date" placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </div>
        </div>
        <el-form-item label="备注" style="display:flex;margin:20px 0 0 0">
          <el-input type="textarea" v-model="paywayList.remark" style="width:400px" :rows="2" placeholder="请输入内容">
          </el-input>
        </el-form-item>
        <el-form-item style="margin:30px 0 0 45%">
          <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
          <el-button @click="trainModifywindow=false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- 修改票号 -->
    <el-dialog title="修改票号" :visible.sync="trainModifyBanks" :close-on-click-modal="false" width="50%">
      <el-table :header-cell-style="{
          color: '#fff',
          background: '#6090EC',
          fontSize: '11px',
          fontWeight: 'normal',
        }" :data="updatePayVoList" border size="mini">
        <el-table-column prop="ticketNo" label="原票号" width="155">
        </el-table-column>
        <el-table-column label="修改票号">
          <template slot-scope="scope">
            <el-input type="textarea" v-model="scope.row.backfillticketNum" :rows="1" size="mini"></el-input>
          </template>
        </el-table-column>
        <el-table-column prop="10" label="操作" width="120">
          <template slot-scope="scope">
            <el-button type="primary" @click="ModifytheBanks(scope.row)" size="mini">修改票号</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-button style="margin:20px 0 0 45%" size="mini" type="primary" @click="trainModifyBanks=false">取消</el-button>
    </el-dialog>
    <!--新建订单 -->
    <el-dialog title="新建订单" :visible.sync="orderadd" :close-on-click-modal="false" width="80%">
      <el-form :model="orderaddList" :rules="orderaddNum" ref="ruleForm" label-width="100px" class="demo-ruleForm"
        size="mini">
        <div style="display:flex;">
          <el-form-item label="支付总金额" prop="payAmount">
            <el-input v-model="orderaddList.payAmount"></el-input>
          </el-form-item>
          <el-form-item label="支付总金额" prop="ticketAmount">
            <el-input v-model="orderaddList.ticketAmount"></el-input>
          </el-form-item>
        </div>
        <div style="display:flex;">
          <el-form-item label="会员姓名" prop="customerName">
            <el-input v-model="orderaddList.customerName"></el-input>
          </el-form-item>
          <el-form-item label="会员手机号" prop="contactPhone">
            <el-input v-model="orderaddList.contactPhone"></el-input>
          </el-form-item>
          <el-form-item label="会员编号" prop="customerId">
            <el-input v-model="orderaddList.customerId"></el-input>
          </el-form-item>
        </div>
        <div v-for="(item,index)  in infoTicketsList" :key="index">
          <div style="display:flex;">
            <el-form-item label="全价">
              <el-input v-model="item.fullPrice"></el-input>
            </el-form-item>
            <el-form-item label="航空公司" prop="name">
              <el-select clearable filterable v-model="item.airliner" style="width:231px" placeholder="请选择">
                <el-option v-for="(item , index) in airportLists" :key="index" :label="item.airlinerId+item.airliner"
                  :value="item.airlinerId">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="出发城市">
              <el-select v-model="item.departure" filterable placeholder="请选择" clearable>
                <el-option v-for="(item, index) in querySearch" :key="index" :label="item.label" :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="到达城市">
              <el-select v-model="item.arrival" filterable placeholder="请选择" clearable>
                <el-option v-for="(item, index) in querySearch" :key="index" :label="item.label" :value="item.label">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="乘客姓名">
              <el-input v-model="item.guestName"></el-input>
            </el-form-item>
            <el-form-item label="舱位等级">
              <el-input v-model="item.cabinGrade"></el-input>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="乘客性别">
              <el-select v-model="item.guestSex" placeholder="请选择乘客性别">
                <el-option label="男" value="F"></el-option>
                <el-option label="女" value="M"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="乘客类型">
              <el-select v-model="item.guestType" placeholder="请选择乘客类型">
                <el-option label="成人" value="成人"></el-option>
                <el-option label="儿童" value="儿童"></el-option>
                <el-option label="婴儿" value="婴儿"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="航班号">
              <el-input v-model="item.flightNo"></el-input>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="证件号">
              <el-input v-model="item.guestIdno"></el-input>
            </el-form-item>
            <el-form-item label="燃油费">
              <el-input v-model="item.fuelFee"></el-input>
            </el-form-item>
            <el-form-item label="机建费">
              <el-input v-model="item.airportFee"></el-input>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="出发时间">
              <el-date-picker v-model="item.departureTime" size="mini" style="width: 140px" placeholder="选择日期"
                :value-format="formats">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="到达时间">
              <el-date-picker v-model="item.arrivalTime" size="mini" style="width: 140px" placeholder="选择日期"
                :value-format="formats">
              </el-date-picker>
            </el-form-item>
            <el-form-item label="证件类型" prop="documentsType">
              <el-select v-model="item.idTypeId" placeholder="请选择证件类型" size="mini" clearable>
                <el-option v-for="item in zhengjian" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="原始票面价">
              <el-input v-model="item.orgPrice"></el-input>
            </el-form-item>
            <el-form-item label="乘机人手机号">
              <el-input v-model="item.guestMobile"></el-input>
            </el-form-item>
            <el-form-item label="舱位">
              <el-input v-model="item.cabin"></el-input>
            </el-form-item>
          </div>
          <div style="display:flex;">
            <el-form-item label="出发机场">
              <el-select v-model="item.orgAirport" placeholder="请选择出发机场" size="mini" clearable>
                <el-option v-for="(item,index) in portList" :key="index" :label="item.airportName"
                  :value="item.airportId">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="到达机场">
              <el-select v-model="item.dstAirport" placeholder="请选择到达机场" size="mini" clearable>
                <el-option v-for="(item,index) in portList" :key="index" :label="item.airportName"
                  :value="item.airportId">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="shanchu(item,index)">删除</el-button>
            </el-form-item>
          </div>
          <hr>
        </div>
        <el-form-item style="margin:30px 0 0 0;">
          <el-button type="primary" @click="infoTicketsbutton">添加机票订单</el-button>
          <el-button type="primary" @click="orderaddsave('ruleForm')">保存</el-button>
          <el-button @click="orderadd=false">取消</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!-- refund -->
    <el-dialog title="退票类型" :visible.sync="refunda" :close-on-click-modal="false" width="50%">
      <el-radio-group v-model="resource">
        <el-radio label="自愿">自愿</el-radio>
        <el-radio label="非自愿">非自愿</el-radio>
      </el-radio-group>
      <div style="margin:20px 0 0 0;display:flex;" v-if="resource=='非自愿'">
        <div style="margin:0 10px 0 0;">非自愿原因</div>
        <el-radio-group v-model="refundfalse">
          <el-radio label="航班延误">航班延误</el-radio>
          <el-radio label="迫降">迫降</el-radio>
          <el-radio label="病退">病退</el-radio>
          <el-radio label="重构客票">重构客票</el-radio>
          <el-radio label="其他非自愿">其他非自愿</el-radio>
        </el-radio-group>
      </div>
      <div style="margin:30px 0 0 0;">
        <el-button type="primary" @click="refundsave">确定</el-button>
        <el-button type="primary" @click="refunda=false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        infoTicketsList: [{
          fullPrice: "",
          airliner: "",
          departure: "",
          arrival: "",
          guestName: "",
          cabinGrade: "",
          guestSex: "",
          guestType: "",
          flightNo: "",
          guestIdno: "",
          fuelFee: "",
          airportFee: "",
          departureTime: "",
          arrivalTime: "",
          orgPrice: "",
          guestMobile: "",
          cabin: "",
          orgAirport: "",
          orderStatus: "unpaid",
          tripType: 'OW',
          flightType: "",
          dstAirport: "",
          idTypeId:null
        }],
        // 航空公司
        airportLists: [],
        // 城市
        querySearch: [],
        roworderId: null,
        refundfalse: "",
        resource: "",
        refunda: false,
        orderaddList: {
          payAmount: null,
          customerName: "",
          customerId: "",
          contactPhone:"",
          ticketAmount:"",
        },
        orderaddNum: {
          ticketAmount: [{
            required: true,
            message: '请输入支付总金额',
            trigger: 'blur'
          }, ],
          contactPhone: [{
            required: true,
            message: '请输入会员手机号',
            trigger: 'blur'
          }, ],
          payAmount: [{
            required: true,
            message: '请输入支付总金额',
            trigger: 'blur'
          }, ],
          customerName: [{
            required: true,
            message: '请输入会员姓名',
            trigger: 'blur'
          }, ],
          customerId: [{
            required: true,
            message: '请输入会员编号',
            trigger: 'blur'
          }, ],
        },
        portList: [],
        zhengjian: [{
            value: 1,
            label: "身份证",
          },
          {
            value: 2,
            label: "军人证",
          },
          {
            value: 3,
            label: "学生证",
          },
          {
            value: 4,
            label: "护照",
          },
          {
            value: 5,
            label: "回乡证",
          },
          {
            value: 6,
            label: "其他证",
          },
          {
            value: 7,
            label: "台胞证",
          },
          {
            value:8,
            label: "驾驶证",
          },
          {
            value: 9,
            label: "港澳通行",
          },
          {
            value: 10,
            label: "户口本",
          },
          {
            value: 11,
            label: "出生证明",
          },
        ],
        outticketLogs:[],//日志
        orderadd: false,
        updatePayVoList: [],
        backfillticketNum: "",
        // 修改票号
        trainModifyBanks: false,
        type: "",
        // 修改支付方式
        paywayList: {
          // 备注
          remark: "",
          // cvv2
          Cvv2: "",
          // 信用卡到期时间
          creditCardTime: "",
          // 姓名
          cardholder: "",
          // 银行卡号
          cardNumber: "",
          // 手机号
          contractPhoneOne: "",
          // 证件号
          custCertificateNo: "",
          // 预留款总额
          reserveMoney: 0,
          // 剩余预留款金额
          asidemoney: '',
          // 使用预留款
          applyMoney: "",
          // 应支付
          shouldbemoney: "",
          // 支付方式
          paytype: "",
        },
        flightOrderAssist:[],//辅营产品
        // 修改支付方式校验
        rules: {
          applyMoney: [{
            required: true,
            message: '请输入使用预留款，不使用请输入0',
            trigger: 'blur'
          }, ],
          paytype: [{
            required: true,
            message: '请选择支付方式',
            trigger: 'change'
          }, ],
          cardNumber: [{
            required: true,
            message: '请输入银行卡号',
            trigger: 'blur'
          }, ],
          cardholder: [{
            required: true,
            message: '请输入持卡人姓名',
            trigger: 'blur'
          }, ],
          contractPhoneOne: [{
            required: true,
            message: '请输入银行预留手机号',
            trigger: 'blur'
          }, ],
          custCertificateNo: [{
            required: true,
            message: '请输入证件号',
            trigger: 'blur'
          }, ],
          Cvv2: [{
            required: true,
            message: '请输入Cvv2',
            trigger: 'blur'
          }, ],
          creditCardTime: [{
            required: true,
            message: '请选择证件有效期',
            trigger: 'blur'
          }, ],
        },
        certificate: [
          {
            value: "creditcard",
            label: "信用卡",
          },
          {
            value: "debitcard",
            label: "储蓄卡",
          },
        ],
        // 通用产品
        selectReturnData: [],
        // 修改表单
        paywayList: {},
        trainModifywindow: false,
        changticketNo: "",
        canceltheorder: {},
        format: "yyyy-MM-dd",
        formats:"yyyy-MM-dd HH:mm:ss",
        CX: {
          date1: new Date(new Date() - (3600 * 1000 * 24 * 7 + 1000)).toLocaleDateString()
            .replace(/\//g, "-"), //   日期时间
          date2: new Date(new Date().getTime() +86400000).toLocaleDateString().replace(/\//g, "-"),
        },
        refundVoList: [], //退票信息
        rebookVoList: [], //改签信息
        tableData: [],
        formInline: {},
        orders: {},
        pageSize: 10,
        currentPage: 1,
        pageTotal: 1,
        ordersList: [],
        cancellog: false,
        lists: "",
        size: "",
        form: {
          orderId: "",
          gustName: "",
          gustPhone: "",
          pnr: "",
          cardNumber: "",
          customerName: "",
          employeeName: "",
          flightNo: "",
          flightSegment: "",
          tripartiteOrderId:"",
          cardNo: "",
          ticketNo: "",
          payStatus: "",
          orderStatus: "", // 客票状态
          ticketWay: "",
          orderSource:"",
          status:"", //订单状态
          // time1: [],
        },
        flightStatusOptionList:[
          {
            label:"全部",
            value:""
          },
          {
            label:"待支付",
            value:"unpaid"
          }, {
            label:"已支付",
            value:"haspay"
          }, {
            label:"支付失败",
            value:"payFail"
          }, {
            label:"取消支付",
            value:"cancelpay"
          }, {
            label:"取消订单失败",
            value:"cancelFail"
          }, {
            label:"出票中",
            value:"outTicket"
          }, {
            label:"出票成功",
            value:"outTicketSuccess"
          }, {
            label:"出票失败",
            value:"outTicketFail"
          }, {
            label:"退票中",
            value:"refundTicket"
          }, {
            label:"退票成功",
            value:"refundTicketSuccess"
          }, {
            label:"退票失败",
            value:"refundTicketFail"
          }, {
            label:"改签退票中",
            value:"changeRefundTicket"
          }, {
            label:"改签退票成功",
            value:"changeRefundTicketSuccess"
          }, {
            label:"改签退票失败",
            value:"changeRefundTicketFail"
          }, {
            label:"改签中",
            value:"changeTicket"
          }, {
            label:"取消改签",
            value:"cancelChangeTicket"
          }, {
            label:"取消改签失败",
            value:"cancelChangeTicketFail"
          }, {
            label:"改签成功",
            value:"changeTicketSuccess"
          }, {
            label:"改签失败",
            value:"changeTicketFail"
          }, {
            label:"改签出票中",
            value:"changeOutTicket"
          }
        ]
      };
    },
    methods: {
      shanchu(row, index) {
        console.log(row, index)
        // row.delete
        this.infoTicketsList.splice(index, 1)
      },
      infoTicketsbutton() {
        let obj = {
          fullPrice: "",
          airliner: "",
          departure: "",
          arrival: "",
          guestName: "",
          cabinGrade: "",
          guestSex: "",
          guestType: "",
          flightNo: "",
          guestIdno: "",
          fuelFee: "",
          airportFee: "",
          departureTime: "",
          arrivalTime: "",
          idTypeId:null,
          orgPrice: "",
          guestMobile: "",
          cabin: "",
          orgAirport: "",
          orderStatus: "unpaid",
          tripType: 'OW',
          flightType: "",
          dstAirport: ""
        }
        this.infoTicketsList.push(obj)
      },
      // 新建订单保存
      orderaddsave(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.getaddFlightOrder()
            // alert('submit!');
            // console.log(this.infoTicketsList)
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      getaddFlightOrder() {
        this.$axios.getaddFlightOrder({
          payStatus:"unpaid",
          payAmount: this.orderaddList.payAmount,
          customerName: this.orderaddList.customerName,
          customerId: this.orderaddList.customerId,
          contactPhone:this.orderaddList.contactPhone,
          contactMobile:this.orderaddList.contactPhone,
          orderStatus: "unpaid",
          ticketAmount:this.orderaddList.ticketAmount,
          infoTickets: this.infoTicketsList
        }).then((res) => {
          if (res.code == 200) {
            this.$message({
              message: '新建成功',
              type: 'success'
            });
            this.orderadd = false
            this.search()
          }
        })
      },
      // 新建订单按钮
      FreeInsurance() {
        this.orderaddList. ticketAmount=null
        this.orderaddList.payAmount = null,
          this.orderaddList.customerName = "",
          this.orderaddList.customerId = "",
          this.infoTicketsList = [{
            fullPrice: "",
          airliner: "",
          departure: "",
          arrival: "",
          guestName: "",
          cabinGrade: "",
          guestSex: "",
          guestType: "",
          flightNo: "",
          guestIdno: "",
          fuelFee: "",
          airportFee: "",
          departureTime: "",
          arrivalTime: "",
          orgPrice: "",
          guestMobile: "",
          cabin: "",
          orgAirport: "",
          orderStatus: "unpaid",
          tripType: 'OW',
          flightType: "",
          dstAirport: ""
          }],
          this.orderadd = true
        this.getairportList()
        this.getselectCityList()
        this.postairportList()
      },
      // 表格退票按钮
      refund(row) {
        this.roworderId = row.orderId
        this.refunda = true

      },
      // 退票确定按钮
      refundsave() {
        if (this.resource == '') {
          this.$message({
            message: '请选择退票类型',
            type: 'warning'
          });
        } else if (this.resource == '非自愿' && this.refundfalse == '') {
          this.$message({
            message: '请选择非自愿原因',
            type: 'warning'
          });
        } else {
          let type = "normal";
          this.$router.push({
            name: "refund",
            params: {
              id: this.roworderId,
              type: type
            },
          });
        }
      },
      getselectCityList() {
        this.$axios.getselectCityList({}).then((res) => {
          console.log(res);
          if (res.code == "00000") {
            let list = JSON.parse(JSON.stringify(res.data));
            this.querySearch = list.map((item) => {
              return {
                label: item.cityName,
                value: item.cityCode
              };
            });
            // console.log(this.querySearch);
          }
        });
      },
      // 机场列表
      postairportList() {
        localStorage.removeItem("pageNum");
        localStorage.removeItem("pageSize");
        this.$axios.postairportList({}).then((res) => {
          console.log(res);
          localStorage.setItem("pageSize", 10);
          localStorage.setItem("pageNum", 1);
          if (res.code == "00000") {
            this.portList = res.data;

          }
        });
      },
      // 航司列表接口
      getairportList() {
        localStorage.removeItem("pageNum");
        localStorage.removeItem("pageSize");
        this.$axios.getairportList({}).then((res) => {
          console.log(res);
          localStorage.setItem("pageSize", 10);
          localStorage.setItem("pageNum", 1);
          if (res.code == "00000") {
            this.airportLists = res.data;
          }
        });
      },
      // 修改确定按钮
      // 修改支付方式保存按钮
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.getsavePay()
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      // 修改支付方式按钮
      trainModify(row) {
        console.log(row)
        console.log(row.orderId);
        this.trainModifywindow = true;
        this.getupdatePayTypeVo(row.orderId)
        // this.getbackSelectCard(row.customerPhone)
      },
      // 支付类型
      cityChange(index) {
        this.type = index;
        console.log(this.type)
      },
      // 获取预留款的事件
      inputaside(row) {
        console.log(row)
        this.paywayList.asidemoney = (this.paywayList.reserveMoney) - row
        if (this.paywayList.reserveMoney < row) {
          this.$message({
            message: '使用金额不得大于预留款现有金额',
            type: 'warning'
          });
          row = 0
        }
        console.log(this.paywayList.asidemoney)
        //  应支付金额
        this.paywayList.shouldbemoney = (this.paywayList.amount) - row
      },

      // 详情
      getupdatePayTypeVo(id) {
        this.$axios.getupdatePayTypeVo({
          orderNum: id
        }).then((res) => {
          console.log(res)
          if (res.code == "00000") {
            this.paywayList = res.data
            console.log(this.paywayList)
            this.updatePayVoList = this.paywayList.orderItemS
          }
        })
      },
     
      // 保存订单
      getsavePay() {
        localStorage.setItem("isToken", true);
        this.$axios.getsavePay({
          // 订单号
          orderNum: this.paywayList.orderNum,
          // 支付方式
          payType: this.type,
          // 应支付金额
          actualAmount: String(this.paywayList.shouldbemoney),
          // 使用预留款
          useReservedMoney: this.paywayList.applyMoney,
          // 证件号
          custCertificateNo: this.paywayList.custCertificateNo,
          // 手机号
          contractPhoneOne: this.paywayList.contractPhoneOne,
          // 银行卡号
          cardNumber: this.paywayList.cardNumber,
          // 姓名
          cardholder: this.paywayList.cardholder,
          // 信用卡到期时间
          creditCardTime: this.paywayList.creditCardTime,
          // cvv2
          Cvv2: this.paywayList.Cvv2,
          // 备注
          remark: this.paywayList.remark,
          // 支付渠道
          payWay: "Crm"
        }).then((res) => {
          console.log(res)
          if (res.code == '200') {
            this.$message({
              message: '保存成功',
              type: 'success'
            });
            this.trainModifywindow = false;
            this.getflightOrderInfoListCRM()
          } else {
            this.$message({
              message: '保存失败，请核对信息重新保存',
              type: 'warning'
            });
          }
        })
      },

      // 修改票号
      BanksModify(row) {
        console.log(row.orderId);
        this.trainModifyBanks = true;
        this.getupdatePayTypeVo(row.orderId)

      },

      // 修改票号确定按钮
      ModifytheBanks(row) {
        // debugger
        console.log(row)
        localStorage.setItem("isToken", true);
        this.$axios.getsavePay({
          // 订单号
          orderNum: this.paywayList.orderNum,
          updatePayVoList: [{
            id: String(row.id),
            ticketNo: row.backfillticketNum
          }]

        }).then((res) => {
          console.log(res)
          if (res.code == '200') {
            this.$message({
              message: '修改成功',
              type: 'success'
            });
            this.trainModifyBanks = false;
            this.getflightOrderInfoListCRM()
            // this.getupdatePayTypeVo()
          } else {
            this.$message({
              message: '修改失败，请核对信息重新保存',
              type: 'warning'
            });
          }
        })
      },
      //跳出
      closeLoading() {
        this.tableLoading.close();
      },
      //进入
      showLoading() {
        this.tableLoading = this.$loading({
          text: "拼命加载数据中", //显示在加载图标下方的加载文案
          spinner: "el-icon-loading", //自定义加载图标类名
          background: "rgba(0, 0, 0, 0.4)", //遮罩层颜色
          target: document.querySelector("#table"), //loadin覆盖的dom元素节点
        });
      },

      handleSizeChange(value) {
        this.pageSize = value;
        this.getflightOrderInfoListCRM();
      },
      handleCurrentChange(value) {
        this.currentPage = value
        this.getflightOrderInfoListCRM();
      },
      // 去支付
      pay(index, row,type = "waitpay") {
        console.log(row)
        let params = {
          Querydata: {},
          orderId: row.orderId,
          payamount: row.payAmount,
          qrCode: row.qrCode,
          type,
        }
        if(type == "change"){
          row.changeRefundS.filter((item)=>{
            if(item.orderChangRefundItem.orderStatus == "unpaid") return item
          })
          params["pnr"] = row.changeRefundS[0].orderChangRefundItem.pnr
        }
        this.$router.push({
          name: "pay",
          params,
        });
        // this.$axios.getqueryCustomer({
        //   phone: row.customerPhone,
        //   idCode: "",
        //   cardNum: ""
        // }).then((res) => {
        //   if (res.code == 200) {
        //     console.log(index, row);
        //     this.$router.push({
        //       name: "pay",
        //       params: {
        //         Querydata: res.data,
        //         orderId: row.orderId,
        //         payamount: row.payAmount,
        //         qrCode: row.qrCode,
        //         type: "waitpay",
        //       },
        //     });
        //   }
        // })

      },
      //接口
      // / flightNo / infos / FlightOrderPending
      search() {
 
        this.getflightOrderInfoListCRM();
      },
      // 订单列表
      getflightOrderInfoListCRM() {
        this.$axios
          .getqueryFlightOrderBOS({
            pageSize:this.pageSize,
            pageNo:this.currentPage,
            orderId: this.form.orderId,
            createTime: this.CX.date1,
            createTimeEnd: this.CX.date2,
            passengerName	: this.form.gustName,
            passengerPhone: this.form.gustPhone,
            PNR: this.form.pnr,
            cardNumber: this.form.cardNumber,
            userName: this.form.customerName,
            adminName: this.form.employeeName,
            flightNo: this.form.flightNo,
            tripartiteOrderId: this.form.tripartiteOrderId,
            flightSegment: this.form.flightSegment,
            orderSource: this.form.orderSource,
            // gustName: this.form.gustName,
            idNumber: this.form.cardNo,
            ticketNo: this.form.ticketNo,
            payStatus: this.form.payStatus,
            orderStatus: this.form.orderStatus,
            ticketWay: this.form.ticketWay,
            status: this.form.status,
          })
          .then((res) => {
            if (res.code == "00000") {
              if (res.data == "") {
                this.$message({
                  message: "暂未查到数据",
                });
              } else {
                let arr = res.data.records;
                arr.forEach((item) => {
                  let length = item.orderItemS.length;
                  this.btnGroupStatus(item);
                  item.orderItemS.forEach((items) => {
                    (items.actionCode = item.actionCode);
                    (items.createTime = item.createTime);
                    (items.orderId = item.orderId);
                    (items.guestNumber = item.orderItemS.guestNumber);
                    (items.pnr = item.pnr);
                  });
                });
                this.ordersList = arr;
                this.pageTotal = res.data.total;
              }
            } else {
              this.$confirm("请核对搜索条件是否有误", "提示", {
                confirmButtonText: "确定",
                type: "warning",
              });
            }
          });
      },
      // 判断按钮状态
      // 按钮开关 btnGroupStatus
      // 详情 detaileBtn 取消订单 cancelBtn，取消改签cancleChangeBtn，去支付goPayBtn，改签去支付goPayChangeBtn，我要改签changeBtn 申请退票returnBtn
      // 修改支付方式changePayBtn 修改票号changeTicktetNoBtn
      btnGroupStatus(data){
        // 初始按钮状态值
        data["btnGroupStatus"] = {
          detaileBtn:true,
          cancelBtn:false,
          cancleChangeBtn:false,
          goPayBtn:false,
          goPayChangeBtn:false,
          changeBtn:false,
          returnBtn:false,
          changePayBtn:false,
          changeTicktetNoBtn:false
        }
        // 深拷贝数据,以防止联动修改
        let orderItemS =[],orderReturnItems=[],changeRefundS =JSON.parse(JSON.stringify(data.changeRefundS));
        // 判断是有返程票或中转票
        data.orderItemS.forEach((item)=>{
          if(item.tripType !== "OW"){
            orderReturnItems.push(item)
          }else{
            orderItemS.push(item)
          }
        })
        if(orderReturnItems.length){
          orderItemS.forEach((item)=>{
            orderReturnItems.forEach((reItem)=>{
              if(item.passengerName === reItem.passengerName){
                item.returnList = reItem
              }
            })
          })
        }
        // 改签/退票列表有数据则合并到主订单列表
        if(changeRefundS.length){
          orderItemS.forEach((item)=>{
            if(!item.refundList) item.refundList = new Object();
            if(!item.changeList) item.changeList = new Object();
            changeRefundS.forEach((changeItem)=>{
              if(item.passengerName === changeItem.orderChangRefundItem.passengerName){
                if(changeItem.orderChangRefundItem.orderStatus === "changeRefundTicketSuccess" || changeItem.orderChangRefundItem.orderStatus === "refundTicketSuccess"){
                  item.refundList=changeItem.orderChangRefundItem;
                }else{
                  item.changeList=changeItem.orderChangRefundItem;
                }
              }
            })
          })
        }
        // 未支付数量，未出行数量，改签待确认数量，已改签数量，已退票数量
        var unpaidNum = 0,paidFaileNum=0,untraveledNum=0,unchangeNum=0,changeNum=0,returnNum=0;
        orderItemS.forEach((item)=>{
          if(item.refundList && Object.keys(item.refundList).length){
            returnNum+=1;
          } else if(item.changeList && Object.keys(item.changeList).length){
            if(item.orderStatus === "changeTicketSuccess") changeNum+=1;
            else unchangeNum+=1;
          }else{
            if(item.orderStatus === "unpaid")unpaidNum+=1;
            if(item.orderStatus === "outTicketFail")unpaidNum+=1;
            if(item.orderStatus === "outTicketSuccess"){
              // 中转票先按改签票走
              if(item.returnList){
                changeNum+=1
              }else{
                untraveledNum+=1;
              }
            }
          }
        })
        if(unpaidNum){
          data.btnGroupStatus.goPayBtn = true;
          data.btnGroupStatus.cancelBtn = true;
        }
        if(changeNum) data.btnGroupStatus.returnBtn = true;
        if(untraveledNum) data.btnGroupStatus.returnBtn = true;
        if(untraveledNum) data.btnGroupStatus.changeBtn = true;
        if(unchangeNum){
          data.btnGroupStatus.cancleChangeBtn = true;
          data.btnGroupStatus.goPayChangeBtn = true;
          data.btnGroupStatus.changeBtn = false;
        }
      },
      // 申请改期
      gaiqi(index, row) {
        this.$router.push({
          name: "endorse",
          params: {
            orderId: row.orderId,
            type: "raincheck",
            contactMobile: row.contactMobile
          },
        });
      },
      // 订单详情弹框
      handleClick(row) {
        // this.cancellog = true;
        this.$router.push({
          name: "flightDetaile",
            params: {
              id: row.orderId,
              type: ''
            },
        })
        // this.getorderFlightDetails(row.orderId);
      },
      
      //取消订单按钮
      cancelClick(index,type) {
        console.log(index);
        if(type == "change"){
          index.changeRefundS.filter((item)=>{
            if(item.orderChangRefundItem.orderStatus == "unpaid") return item
          })
        }
        this.canceltheorder = index;
      },
      //取消订单点击事件
      confirmClick() {
        this.getcancelFlightOrder();
      },
      // 取消订单
      getcancelFlightOrder() {
        let apiUrl = "",parma=new Object()
        if(this.canceltheorder.changeRefundS.length){
          apiUrl  = "getcancelChangeFlightOrder";
          parma = {
            orderId: this.canceltheorder.orderId,
            pnr:this.canceltheorder.changeRefundS[0].orderChangRefundItem.pnr,
          }
        }else{
          apiUrl = "getcancelFlightOrder";
          parma = {
            orderId: this.canceltheorder.orderId,
          }
        } 
        this.$axios[apiUrl](parma).then((res) => {
            console.log(res);
            if (res.code == "00000") {
              this.$message({
                message: "取消订单成功！",
                type: "success",
              });
              this.getflightOrderInfoListCRM()
            }
          });
      },
      handleClose() {
        this.cancellog = false;
      },

      // 表单回车跳转下一个
      accountLogin(nextRef) {
        this.$refs[nextRef].focus();
      },
    },
    mounted() {
      localStorage.setItem("pageSize", 10);
      localStorage.setItem("pageNum", 1);
      this.getflightOrderInfoListCRM();
      // this.getFlightOrderPending()
      // 当前时间
      var nowData = new Date();
      this.CX.date2 = new Date() .toLocaleDateString()
            .replace(/\//g, "-")
      this.CX.date1 = new Date(nowData.setDate(nowData.getDate() - 7)) .toLocaleDateString()
            .replace(/\//g, "-")
      // this.$wsk.ws.onmessage = function (result) {
      // };
      // debugger;
      // this.$wsk.ws.send(
      //   JSON.stringify({
      //     // 连接成功将，用户ID传给服务端
      //     uid: "wolong",
      //   })
      // );
    },
  };
</script>

<style scoped>
  /* 顶部 */
  .boxs li {
    list-style-type: none;
    font-size: 12px;
  }

  .box-top {
    height: 16px;
    width: 48px;
    padding-left: 24px;
    padding-top: 23px;
  }

  /* 中间 */
  .box-middle {
    width: 1260px;
    padding-left: 24px;
    padding-top: 23px;
  }

  .box-middle .el-from {
    padding-left: 24px;
    padding-top: 23px;
  }

  /* 底部 */
  .box-button {
    padding-left: 24px;
    line-height: 30px;
  }

  /* 底部表格 */
  .box-button-form {
    font-size: 11px;
  }

  /* 底部分页 */
  .block {
    margin: 10px 0 0 24px;
  }
</style>